<template>
    <div id="formContainer" style="width:100%;height: 100%">
        <component :is="currentView" ref="component" :insColumnDef="insColumnDef" />
    </div>
</template>

<script>
import baseColumnDefView from "./baseColumnDefView.js";
import FormCustomApi from "@/common/api/form/formCustom.js";

/**
 * 自定义页面(栏目组件)
 */
export default {
    name: "columnView",
    mixins: [baseColumnDefView],
    props: {
        config: {
            type: Object,
            default: {},
        },
    },
    data() {
        return {
            insColumnDef: ""
        }
    },
    created() {
        this.getInsColumnDef();
    },
    methods: {
        getInsColumnDef() {
            if (this.config.colId) {
                FormCustomApi.getColumnById(this.config.colId).then(res => {
                    this.insColumnDef = res.data;
                    this.load();
                });
            }
        }
    },
    watch: {
        config: {
            handler: function (val, oldVal) {
                if (val) {
                    this.getInsColumnDef();
                }
            },
            deep: true
        }
    },
}
</script>

<style scoped></style>
<style src="@/assets/css/portal/NewLayoutView.css" />
<style src="@/assets/css/portal/portalLayoutView.css" />
